<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>密码转换工具</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <div class="container">
        <div class="letter-box">
            <h1>密码转换工具</h1>
            <div class="converter-form">
                <div class="form-group">
                    <label for="numberInput">输入数字:</label>
                    <input type="text" id="numberInput" placeholder="请输入要转换的数字">
                </div>
                <button id="convertBtn">转换为密码</button>
                <div class="result">
                    <label>转换结果:</label>
                    <input type="text" id="resultOutput" readonly>
                </div>
            </div>
            <div class="actions">
                <a href="index.html" class="btn">返回主页面</a>
            </div>
        </div>
    </div>
    <script src="scripts.js"></script>
    <script>
        // 页面加载后执行
        document.addEventListener('DOMContentLoaded', function() {
            const convertBtn = document.getElementById('convertBtn');
            const numberInput = document.getElementById('numberInput');
            const resultOutput = document.getElementById('resultOutput');

            convertBtn.addEventListener('click', function() {
                const number = numberInput.value.trim();
                if (!number) {
                    alert('请输入数字');
                    return;
                }

                // 简单的转换算法: 数字转成Base64
                // 在实际应用中可以使用更复杂的算法
                const password = btoa(number);
                resultOutput.value = password;
            });
        });
    </script>
</body>
</html>